<template>
  <Modal v-model="modal" :title="title">
    <div class="tag-modal">
      <Form :model="form" :label-width="200" ref="form" :rules="rules">
        <FormItem label="选择尺寸" prop="tireSize">
          <Select v-model="form.tireSize" clearable @on-change="getData">
            <Option v-for="item in tire_sizeArr" :value="item.value" :key="item.value">{{item.text}}</Option>
          </Select>
        </FormItem>
        <FormItem label="生效">
          <Checkbox v-model="form.isMatch"></Checkbox>
          <span>(不勾选时仅不需要判断订单商品数量)</span>
        </FormItem>
        <FormItem label="匹配的订单商品总数量大于等于">
          <InputNumber :max="999999" :min="1" v-model="form.productNum"></InputNumber>
          <span>条</span>
        </FormItem>
        <FormItem label="送云豆">
          <InputNumber :max="999999" :min="1" v-model="form.goldNum"></InputNumber>
        </FormItem>
      </Form>
    </div>
    <div slot="footer">
      <Button @click="modal = false" size="large" type="text">取消</Button>
      <Button :disabled="btnDisabled" @click="onSave" type="primary" size="large">保存</Button>
    </div>
  </Modal>
</template>
<script>
import { getTireArr } from '@/util'
export default {
  data() {
    return {
      tire_sizeArr: [],
      item: '',
      oldSize: null,
      modal: false,
      title: '扫码入库送云豆',
      btnDisabled: false,
      rules: {
        tireSize: [
          { required: true, message: '请选择尺寸', trigger: 'change' }
        ]
      },
      form: {
        tireSize: '',
        goldNum: 1,
        productNum: 1,
        isMatch: true
      },
      status: 'pass',
      id: ''
    }
  },
  methods: {
    //尺寸
    getTireData() {
      getTireArr().then(data => {
        this.tire_sizeArr = data.data.tire_rim.filter(item => item.val).map(item => { //尺寸
          return {
            value: item.val,
            text: item.name
          }
        })
      })
    },
    openForm(item) {
      this.$refs.form.resetFields()
      if (item) {
        this.item = item
        this.id = item.id
        this.form = {
          tireSize: item.tireSize,
          goldNum: item.goldNum,
          productNum: item.productNum,
          isMatch: item.isMatch
        }
        this.oldSize = item.tireSize
      } else {
        this.id = ''
        this.oldSize = null
        this.form = {
          tireSize: '',
          goldNum: 1,
          isMatch: true,
          productNum: 1
        }
      }
      this.btnDisabled = false
      this.getTireData()
      this.openModal()
    },
    openModal() {
      this.modal = true
    },
    closeModal() {
      this.modal = false
    },
    onSave() {
      if (this.btnDisabled) return
      this.$refs["form"].validate(valid => {
        if (valid) {
          let text = this.id ? '编辑' : '新增'
          let url = this.id ? `/gold/rule/edit_product` : '/gold/rule/save_product'
          let param = {
            productTypeEnum: 'PRODUCT_SIZE',
            tireSize: this.form.tireSize,
            goldNum: this.form.goldNum,
            isMatch: this.form.isMatch,
            productNum: this.form.productNum
          }
          if (this.id) {
            param.id = this.id
          }
          this.status = 'loading'
          this.$jsonPost(url, param).then(data => {
            this.$Notice.success({
              title: `${text}成功`
            })
            this.$emit('scan')
            this.closeModal()
            this.status = 'pass'
            this.disabled = false
          }).catch(() => {
            this.status = 'pass'
            this.disabled = false
          })
        } else {
          this.disabled = false
        }
      })
    }
  }
}
</script>